<!DOCTYPE html>
<html lang="en">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>个人中心-个人资料</title>
	<link href="#" rel="shortcut icon">
	<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
	<script src="js/md5.js"></script>
	<script src="js/layer.js"></script>
	<script type="text/javascript" src="js/public.js"></script>
	<link type="text/css" rel="stylesheet" href="css/layout.css">
	<link rel="stylesheet" type="text/css" href="css/bifa.css">

</head>

<body>
	<iframe src="./header.html" id="header" width="100%" height="185" frameborder="0" scrolling="no" ></iframe>		
	<div class="standing">
		<div class="stand-w w clearfix">
			<div class="stand-left">
				<div class="user-person">
					<div class="user-mess">
						<div class="mess-pic"><img /></div>
						<div class="mess-name">
							<p>账户名：<span id="user-name"></span></p>
							<p>余额：<span id="user-total"></span></p>
						</div>
					</div>
					<div class="tw-btn">
						<span class="recharge-btn">充值</span>
						<span class="withdraw-btn">提现</span>
					</div>
				</div>
				<ul class="stand-ul">
					<li>
						<a href="lottery.html">
							<div class="stand-list">
								<img src="images/lottery.png" >
								<span>中奖历史</span>
							</div>
						</a>
					</li>
					<li >
						<a href="standings.html">
							<div class="stand-list">
								<img src="images/standings.png" >
								<span>战绩</span>
							</div>
						</a>
					</li>
					<li >
						<a href="detail.html">
							<div class="stand-list">
								<img src="images/detail.png" >
								<span>账户明细</span>
							</div>
						</a>
					</li>
					<li>
						<a href="transaction.html">
							<div class="stand-list">
								<img src="images/transaction.png" >
								<span>交易记录</span>
							</div>
						</a>
					</li>
					<li class="hover">
						<a href="personal.html">
							<div class="stand-list">
								<img src="images/personal.png" >
								<span>个人资料</span>
							</div>
						</a>
					</li>
					<li>
						<a id="server">
							<div class="stand-list">
								<img src="images/server.png" >
								<span>客服</span>
							</div>
						</a>
					</li>
					<li>
						<a href="information.html">
							<div class="stand-list">
								<img src="images/information.png" >
								<span>消息中心</span>
							</div>
						</a>
					</li>
				</ul>
			</div>
			<div class="stand-right">
				<div class="person-top">
					<h3>个人资料</h3>
				</div>
				<div class="person-body">
					<ul>
						<li class="li-pic">
							<span>头像</span>
							<img  id="picimg" />
							<input type="file" id="file" accept="image/png, image/jpeg">
						</li>
						<li><span>用户名：</span> <span class="pr per-user"></span></li>
						<li><span>真实姓名：</span> <span class="pr per-name"></span></li>
						<li id="loginpassword"><span>登录密码：</span> <span class="pr per-login">修改 ></span></li>
						<li id="withdrawel"><span>取款密码：</span><span class="pr per-drawel">修改 ></span></li>
						<li id="bankcard"><span>银行卡：</span> <span class="pr per-card">></span></li>
					</ul>
				</div>

			</div>
		</div>
	</div>
	

	<iframe src="./footer.html" width="100%" height="80" frameborder="0" scrolling="no" ></iframe>	


	<script>
		// 个人资料
		$(function(){

			var uid = getCookie('uid');
			var userObj = jsonObj;//个人信息
			userObj.uid = uid;
			
			var passwordObj = jsonObj;// 修改密码
			passwordObj.uid = uid;
			//用户信息
			$ajax(
				url+'member_info',
				'post',
				userObj,
				function(data){
					
					if(data.data.avatar){
						$('.mess-pic img,.li-pic img').attr('src',data.data.avatar);//用户头像
					}else{
						$('.mess-pic img,.li-pic img').attr('src','images/user-pic.png');
					}
					$('#user-name').text(data.data.username);
					$('#user-total').text(data.data.balance);
					$('#server').click(function(){
						openQQ(data.data.serviceQQ)
					})

					$('.per-user').text(data.data.username);
					$('.per-name').text(data.data.realname);

					deposit(data) //提现

					$('.per-card').text(data.data.bankCard + ' >');//显示银行卡号

					$('#bankcard').click(function(){
							if(data.data.bankCard != ''){//银行卡号

							layer.open({
								type: 1,
								title: false,
								skin: 'lay-passworld', //样式类名
								closeBtn: 0, //不显示关闭按钮
								anim: 2,
								area: ['450px', '320px'],
								shadeClose: true, //开启遮罩关闭
								content: '<div class="lay-box">'+
														'<div class="lay-boxs">'+
																'<div class="lay-boxinp">'+
																	'<span>取款限额</span>'+
																	'<span class="lay-w">'+data.data.minDrawVal + ' - '+ data.data.maxDrawVal+' 元</span>'+
																'</div>'+
																'<div class="lay-boxinp">'+
																	'<span>户主</span>'+
																	'<span class="lay-w">'+data.data.payeeName +'</span>'+
																'</div>'+
																'<div class="lay-boxinp">'+
																	'<span>银行卡</span>'+
																	'<span class="lay-w">'+data.data.bankCard+'</span>'+
																'</div>'+
														'</div>'+
														'<div class="lay-rule">'+
															'<h4>友情提示</h4>'+
															'<p>1.银行账户持有人姓名必须与注册时输入的姓名一致，否则无法申请提款。</p>'+
															'<p>2.每位客户只可以使用一张银行卡进行提款，如有需要更换银行卡请联系客服进行咨询，否则提款将被拒绝</p>'+
														'</div>'+
													'</div>'
							});
						
						}else{//跳转到绑银行卡页面
							window.location.href = './bankcard.html'
						}
					})
					// 判断是否绑定银行卡 修改取款密码
					$('#withdrawel').click(function(e){
						
						if(data.data.bankCard == ''){
							layer.msg('未绑定银行卡');
							
						}else{
							modific('modify_draw_pwd');
						}

					})
					// 修改登录密码
					$('#loginpassword').click(function(){
						modific('modify_pwd');
					})
				},
				function(data){
					layer.msg(data.msg)
				}
			)
			// 修改密码
			function modific(curl){
				layer.open({
					type: 1,
					title: false,
					skin: 'lay-passworld', //样式类名
					closeBtn: 0, //不显示关闭按钮
					anim: 2,
					area: ['450px', '320px'],
					shadeClose: true, //开启遮罩关闭
					content: '<div class="lay-box">'+
											'<div class="lay-boxs">'+
												'<form action="?">'+		
													'<div class="lay-boxinp">'+
														'<span>旧密码</span>'+
														'<input type="password" placeholder="请输入旧密码" id="oldpassword">'+
													'</div>'+
													'<div class="lay-boxinp">'+
														'<span>新密码</span>'+
														'<input type="password" placeholder="请输入新密码" id="newpassword">'+
													'</div>'+
													'<div class="lay-boxinp">'+
														'<span>确认密码</span>'+
														'<input type="password" placeholder="请再次输入密码" id="affpassword">'+
													'</div>'+
													'<button class="lay-confim" type="button">确认修改</button>'+
													'<button class="lay-reset" type="reset">重置</button>'+
											'</form>'+
											'</div>'+
										'</div>'+
									'</div>'
				});
				
				$('.lay-confim').click(function(){
					
					passwordObj.oldPassword = hex_md5($('#oldpassword').val());
					passwordObj.newPassword = $('#newpassword').val();
					if($('#newpassword').val() != $('#affpassword').val()){
						layer.msg('两次密码不一样')
					}else{
						$ajax(
							url+curl,
							'post',
							passwordObj,
							function(data){
								layer.msg(data.msg,{time:1000},function(){
									layer.closeAll();
								});
								
							},
							function(data){
								layer.msg(data.msg)
							}
						)
					}
				})
			}
			
			// 充值
			$('.recharge-btn').click(function(){
				window.location.href = './recharge.html'
			})

			// 修改头像
			$('#file').change(function (e) {
					var file = e.target.files[0] || e.dataTransfer.files[0];
					$('#photoCover').val(document.getElementById("file").files[0].name);
					if (file) {
						
							var reader = new FileReader();
							reader.onload = function () {
									$("#picimg").attr("src", this.result);
									
							}
							reader.readAsDataURL(file);

							var formData = new FormData(userObj);
							formData.append('uid', uid);
							formData.append('avatar', file);
							
							$.ajax({
								url:url+'upload_avatar',
								type:'POST',
								data:formData,
								dataType:'json',
								contentType: false,
                processData: false,
                mimeType: "multipart/form-data",
								success:function(data){
									console.log(data);
									$('.mess-pic img').attr('src',data.data.avatar);
								},
								error:function(data){
									console.log(data);
								}
							})
					}
			});

		})
	</script>
</body>

</html>